<template>
  <div>
    <h2>详情---{{ id }}</h2>

    <dl v-for="v in list" :key="v.id">
      <dt>
        <img :src="v.url" alt="" />
      </dt>
      <dd>
        <h3>{{ v.title }}</h3>
        <p>{{ v.desc }}</p>
      </dd>
    </dl>
  </div>
</template>

<script>
import axios from "axios";
export default {
  data() {
    return {
      list: [],
    };
  },
  computed: {
    id() {
      return this.$route.params.id;
    },
  },
  methods: {
    async fetchDetailData(id) {
      const resp = await axios.post("/api/car/detail", { id });
      console.log(resp.data.data);
      this.list = resp.data.data;
    },
  },
  mounted() {
    this.fetchDetailData(this.id);
  },
};
</script>

<style scoped>
dl {
  display: flex;
}
</style>